<template>
  <div class="workOrderIndex">
    <WorkOrderHeader :flowType="workApplyData?.data?.flowType"/>
    <template v-if="workOrderType === 'workOrderInform'">
      <!--      用章申请工单-->
      <template v-if="workApplyData?.data?.flowType === 'chapterApply'">
        <UseSealApplyWorkOrder :workApplyData="workApplyData.data"/>
      </template>
      <!--      任务派发工单-->
      <template v-if="workApplyData?.data?.flowType !== 'chapterApply'">
        <ToDoWorkOrder :workApplyData="$store.state.workApplyData" />
      </template>
    </template>
    <template v-if="workOrderType === 'historyRecord'">
      <WorkOrderRecord :workApplyData="$store.state.workApplyData" />
    </template>
  </div>
</template>

<script>
import WorkOrderHeader from '../components/home/workOrder/WorkOrderHeader'
import ToDoWorkOrder from '../components/home/workOrder/ToDoWorkOrder'
import WorkOrderRecord from '../components/home/workOrder/WorkOrderRecord'
import UseSealApplyWorkOrder from '../components/home/workOrder/UseSealApplyWorkOrder'
import {mapState} from "vuex";

export default {
  name: "WorkOrderIndex",
  components: {
    WorkOrderHeader,
    ToDoWorkOrder,
    WorkOrderRecord,
    UseSealApplyWorkOrder
  },

  computed: {
    ...mapState(['workOrderType', 'workApplyData']),
  },
}
</script>

<style type="text/css">
.workOrderIndex {
  width: 100vw;
  height: 100vh;
  font-size: 15px;
  font-family: "Microsoft Yahei", Arial, sans-serif;
  color: #333;
  overflow: hidden;
}
</style>
